<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>已发消息详情</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${ctx}/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="${ctx}/systemStatic/style/admin.css">
    <link rel="stylesheet" href="${ctx}/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="${ctx}/css/public.css">
    <style>
        .file-id{
            cursor:pointer
        }
    </style>
    <script type="text/javascript">
        var __ctx = "${ctx}";
    </script>
</head>
<body>

<div>
<div class="layui-fluid " style="padding: 10px;position: absolute;left: 0;overflow: auto;top: 0; bottom: 0;right: 0;">
    <div class="layui-row">
        <div class="layui-col-xs12">
            <div class="layui-card">
                <div class="layui-card-header">
                    <a class="cancelAddedit" title='返回' style='pointer:cursor'>
                        <i class="layui-icon layui-icon-return" style='pointer:cursor'></i>
                    </a>
                    <span class="indexColumnTitle">发送消息详情</span>
                </div>
                <div class="layui-card-body">

<form class="layui-form getViewForm"  lay-filter="getViewForm" style="padding:20px 28px 20px 0;background: #fff" >
    <div class="layui-form-item">
        <label class="layui-form-label">标题</label>
        <div class="layui-input-block" id="name" style="width:90%">
            <input  type="text" name="subject" readonly="readonly" lay-verify="subject" autocomplete="off"  class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">收件人</label>
        <div class="layui-input-block" style="width:90%">
            <div style="padding: 8px" class="layui-input">
                <p readonly="readonly" name="receiverName" ></p>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">发信时间</label>
        <div class="layui-input-block" style="width:90%">
            <input type="text" name="sendTime"  readonly="readonly" lay-verify="sendTime" autocomplete="off"  class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">附件</label>
        <div class="layui-input-block" style="width:90%">
            <div class="uploadFileList" style="padding-top: 9px;"></div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">回复内容:</label>
        <div class="layui-input-block" style="width:90%">
        <div style="padding: 8px" class="layui-input">
        <a id="replyWindow" href="javascript:void(0)"; style="color: blue;margin-right: 5px;"class="layui-badge-rim">查看回复</a>
        </div>
    </div>
    </div>
    <input type="hidden" name="id" />
</form>

<ul class="layui-tab-title">
    <li class="layui-nav-item layui-this layim-this"><a id="read">已读列表</a></li>
    <li class="layui-nav-item "><a id="reply">回复列表</a></li>
</ul>

<div id="readList"  style="overflow-y: auto;overflow-x: hidden;">
    <table   id="readTable" lay-filter="readTable"></table></div>
<div id="replyList" style="display:none;overflow-y: auto;overflow-x: hidden;">
    <table  id="replyTable" lay-filter="replyTable"></table></div>

<div class="layui-form-item" style="margin: 5px 0;text-align: center">
    <div class="layui-input-block" style="text-align: center">
        <a class="layui-btn layui-btn-danger cancelAddedit">返回</a>
    </div>
</div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<script src="${ctx}/public/component.js" type="text/javascript"></script>
<script src="${ctx}/layui/layui.js"></script>
<script>
    layui.config({
        base: serverPath.systemPath + staticPath.systemPath //静态资源所在路径
    }).extend({
        index: 'index' //主入口模块
    }).use(['index','table', 'layer', 'setter', 'commons','common', 'totalFilter', 'form','jquery','upload','layedit'], function () {
        var util = layui.util;  var table = layui.table, layer = layui.layer, setter = layui.setter, commons = layui.commons, common = layui.common,
            totalFilter = layui.totalFilter, form = layui.form, $=layui.jquery;
        var layedit = layui.layedit;
        var id = '${id}';

        $(".cancelAddedit").click(function () {
            $(this).attr("href", serverPath.systemPath+setter.sysLinkPath+"messageSend/view/form");
        });

        //初始化表单
        $.ajax({
            url: serverPath.systemPath + setter.sysLinkPath +"messageSend/get",
            type: "get",
            contentType: 'application/json',
            dataType: 'json',
            data: {id: id},
            success: function (data) {
                if (commons._filterRecord(data)) {
                    var returnDate = data.data;
                    form.val('getViewForm',{
                        "subject": returnDate.subject,
                        "sendTime": util.toDateString(returnDate.sendTime, "yyyy-MM-dd HH:mm:ss"),
                        "attachment": jsonFile(returnDate.jsonFile) ,
                        "content": returnDate.content,
                        "id":returnDate.id,
                    });
                    //显示收件人和收信组织信息
                    var receiverOrgNameList=returnDate.receiverOrgName.split(",");
                    var receiverOrgIdList=returnDate.receiverOrgId.split(",");
                    var receiverNameList=returnDate.receiverName.split(",");
                    var receiverIdList=returnDate.receiverId.split(",");
                    if(returnDate.receiverId!=null&&returnDate.receiverId!='') {
                        for (var i = 0; i < receiverIdList.length; i++) {
                            if(receiverIdList[i] != null && receiverIdList[i] != ''){
                                $.get(serverPath.systemPath + setter.sysLinkPath + "sysUser/get?userId=" + receiverIdList[i], function (userData, status) {
                                    var userEnt = userData.data;
                                    if(userEnt) {
                                        $("[name='receiverName']").append("<a onclick=authUserClick('" + userData.data.userId + "') href=\"javascript:void(0);\" class=\"layui-badge-rim\" style=\"color: blue;margin-right: 5px;\">" + userData.data.fullName + "</a>");
                                    }else{
                                        $("[name='receiverName']").append("<span   style=\"color: red;margin-right: 5px;\"> 该用户已不存在 </span>");
                                    }
                                }, "json");
                            }
                        }
                    }
                    if(returnDate.receiverOrgName!=null&&returnDate.receiverOrgName!="") {
                        for (var i = 0; i < receiverOrgNameList.length; i++) {
                                $("[name='receiverName']").append('<span class=\"layui-badge-rim\" style=\"margin-right: 5px;\">' + receiverOrgNameList[i]+ '</span>');
                            }
                    }
                } else {
                    window.parent.layer.alert(data.msg);
                }
            }
        });
        //下载附件
        window.downFile = function (obj){
            var fileId =  $(obj).parents("span").attr("fileId");
            window.location.href = serverPath.formPath + setter.sysLinkPath + "attachFile/download?fileId="+fileId;
        };

        function jsonFile(jsonFile) {
            var files = eval(jsonFile);
            if(files){
                for(var i=0;i<files.length;i++){
//                    var newStr = '<li fileId=' + files[i].fileId + '><p onclick="downFile(this)">' + files[i].fileName+ '</p><i class="layui-icon layui-icon-delete deleteFile" ></i></li>';
                    var newStr = '<span class="file-id" style="margin-right: 20px;" fileId=' + files[i].fileId + '><span onclick="downFile(this)">' + files[i].fileName+ '</span></span>';
                    $('.uploadFileList').append(newStr);
                }
            }
        }

        //表格初始化
        table.render({
            elem: '#readTable'
            , url: serverPath.systemPath +setter.sysLinkPath +'messageSend/readDetail?id='+id
            , page:false
            , title: '数据库表信息'
            , height: '341px'
            , method: 'post'
            , cols: [[ //表头
                {field: 'receiver', title: '读信人', sort:true}
                , {field: 'receiveTime', title: '读信时间',templet:function(d){
                        if (d.receiveTime == undefined) {
                            return "";
                        }else {
                            return util.toDateString(d.receiveTime, "yyyy-MM-dd HH:mm:ss");
                        }
                    }}
            ]]
        });
        totalFilter.init('readTable');
        table.render({
            elem: '#replyTable'
            , url: serverPath.systemPath +setter.sysLinkPath +'messageSend/replyDetail?messageId='+id
            , page: false
            , title: '数据库表信息'
            , height: '340px'
            , method: 'post'
            , cols: [[
                {field: 'reply', title: '回复人', sort:true}
                , {field: 'replyTime', title: '回复时间',templet:function(d){
                        if (d.replyTime == undefined) {
                            return "";
                        }else {
                            return util.toDateString(d.replyTime, "yyyy-MM-dd HH:mm:ss");
                        }
                    }}
                , {
                    field: 'content', title: '回复内容',
                    sort: true
                }
            ]]
        });
        totalFilter.init('replyTable');
        layui.use(['layer','setter'], function () {
            var setter = layui.setter
                ,layer = layui.layer;
            $('#replyWindow').click(function () {
                layer.open({
                    type:2
                    ,title:'回复明细'
                    ,area:['1000px','585px']
                    ,content: serverPath.systemPath + setter.sysLinkPath+'messageSend/view/replyList?id='+id
                });
            })
        });
        //监听排序
        table.on('sort(replyTable)', function(obj){
            table.reload('replyTable', { //testTable是表格容器id
                where: {
                    orderField: obj.field //排序字段
                    ,orderSeq: obj.type //排序方式
                }
            });
        });

        table.on('sort(readTable)', function(obj){
            table.reload('readTable', { //testTable是表格容器id
                where: {
                    orderField: obj.field //排序字段
                    ,orderSeq: obj.type //排序方式
                }
            });
        });
        window.authUserClick = function(ownerId){
            layer.open({
                type: 2,
                title: '人员详细信息',
                area: ['650px', '570px'],
                shadeClose: true,
                content: serverPath.systemPath + setter.sysLinkPath+'sysUser/view/view?userId=' + ownerId
            });
        };
        //回复、已读列表显示
        $("#read").click(function () {
            $("#readList").show();
            $("#replyList").hide();
            $("#reply").attr("class","layui-nav-item");
            $("#read").attr("class","layui-nav-item layui-this");
        })
        $("#reply").click(function () {
            $("#readList").hide();
            $("#replyList").show();
            $("#reply").attr("class","layui-nav-item layui-this");
            $("#read").attr("class","layui-nav-item ")
        })
    });
</script>
</body>
</html>